<template>
  <div>
    <BannerVue></BannerVue>
    <div class="content">
      <div class="banxin">
        <div class="title">
          <img src="../../assets/line.png" alt=""> 
          <span>服务内容</span>
        </div>
        <div class="info">
          <p>公司的数智化研发提供工程投标动画演示、施工工艺动画演示、实景+三维合成、航拍+线位叠加。我们针对不同的服务对象提供最周到的服务内容，具体服务内容如下:::</p>      
        </div>
      </div>
      <div class="boxs">
        <div class="box">
          <img src="../../assets/point.png" alt="">
          <p class="title">工程投标动画演示</p>
          <p class="desc">包括工程介绍、施工组织、重难点技术等，通过虚拟仿真技术提前模拟施工过程，并将项目实施过程中的重要数据指标伴随施工进度动态显示的动画模式，可以直观地展示施工部署、施工方案、施工进度、资源管理等内容，让业主在最短时间内捕捉到投标单位的技术优势。</p>
        </div>
        <div class="box box_d">
          <img src="../../assets/point.png" alt="">
          <p class="title">施工工艺动画演示</p>
          <p class="desc">包括工序模拟、技术交底、复杂施工工艺，提前展示施工成果，能够避免在施工过程中造成的错误，并能对已经造成的失误做出及时调整的修改，能够提高施工工程质量。对于一些复杂的工程还可以提前制作出施工方案，对施工人员做出培训，确保施工安全性。 3. 无需账号、密码登录，方便模型转发，交流使用等。</p>
        </div>
        <div class="box">
          <img src="../../assets/point.png" alt="">
          <p class="title">实景+三维合成</p>
          <p class="desc">将航拍视频/实景模型，与三维模型进行融合，在更加真实的场景中体现工程。         基于详尽的航测数据，进行影像预处理、区域联合评差、多视影响等一系列操作，批量建立高质量、高精度的三维GIS模型。</p>
        </div>
        <div class="box box_d">
          <img src="../../assets/point.png" alt="">
          <p class="title">航拍+线位叠加</p>
          <p class="desc">在航拍视频基础上，叠加道路CAD线位。/实景模型，与三维模型进行融合，在更加真实的场景中体现工程。         基于详尽的航测数据，进行影像预处理、区域联合评差、多视影响等一系列操作，批量建立高质量、高精度的三维GIS模型。</p>
        </div>
      </div>
    </div>
    <CooperateVue></CooperateVue>
    <FootVue></FootVue>
  </div>
</template>

<script>
import BannerVue from '@/components/Banner/index.vue'
import CooperateVue from '@/components/Cooperate/index.vue'
import FootVue from '@/components/Foot/index.vue'

export default {
  name: 'AnimationVue',
  components: {
    BannerVue,
    CooperateVue,
    FootVue
  },
  setup () {
    return {
    }
  }
}
</script>

<style lang="scss" scoped>
.active{
  color: rgba(0, 96, 255, 1);
}
.content{
  height: 8.75rem;
  padding: .625rem 0;
  .title{
    display: flex;
    align-items: center;
    font-weight: 700;
    img{
      margin-right: .125rem;
      height: .375rem;
    }
    span{
      font-size: .3rem;
    }
  }
  .info{
    text-indent: 2em;
    color: rgba(102, 102, 102, 1);
    line-height: .375rem;
    margin-top: .625rem;
  }
  .boxs{
    display: flex;
    justify-content: space-between;
    width: 17rem;
    margin: .625rem auto;
    .box{
      width: 24%;
      height: 4.25rem;
      position: relative;
      color: aliceblue;
      padding: .375rem;
      margin:0 .0625rem;
      background-color: rgba(140, 185, 254, 1);
      img{
        width: .18rem;
        display: block;
      }
      .title{
        font-size: .225rem;
        line-height: .375rem;
      }
      .desc{
        // margin-top: 20px;
        width: 80%;
        position: absolute;
        bottom: 5%;
      }
    }
    .box_d{
      background-color: rgba(102, 162, 254, 1);
    }
  }
}

</style>